<%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>历史抢租记录</title>
<link rel="stylesheet" href="../../css/bootstrap.min.css">
<style type="text/css">
#myDiv {
	width: 800px;
	margin-left: 120px;
	margin-top: 70px;
	
}
td{
	text-align: center;	
	}
	
	.pager{
		position:absolute;
		left:300px;
		top:300px;
	}
</style>
</head>
<body>
	<div id="myDiv">
	<input type="hidden" id="userID" name="userID" value="${sessionScope.myRenter.user.userID}">
		<table class="table table-striped table-bordered" id="recordsTable">
			<tr>
				<td>编号</td>
				<td>出租车位</td>
				<td>开始时间</td>
				<td>结束时间</td>
				<td>包租婆</td>
				<td>操作</td>
			</tr>
		</table>
		<ul class="pager">
			<li><a href="javascript:void(0)" id="firstPage">首页</a></li>
			<li><a href="javascript:void(0)" id="pageUp">前一页</a></li>
			<li><label id="currentPage"></label><label>/</label><label
				id="pageCount"></label></li>
			<li><a href="javascript:void(0)" id="pageDown">后一页</a></li>
			<li><a href="javascript:void(0)" id="lastPage">末页</a> 跳转至<input style="width:50px;" id="pagess" name="page" type="text" size="2"  maxlength="2" value="1" onkeyup='this.value=this.value.replace(/\D/gi,"")'>页</li>
			<li><a href="javascript:void(0)" id="forPage">跳转</a></li>
		</ul>
	</div>
	<script type="text/javascript" src="../../js/jquery-3.1.0.min.js"></script>
	<script type="text/javascript">
	
		$(function() {
			init();
		});
		function init() {
			countPageCount();
			findAllRecord(1);
		};
		function findAllRecord(currentPage) {
			//获取隐藏字段中的userID
			var userID = $("#userID").val();
			$.ajax({
						type : "POST",
						url : "findOnePageRecord.do", // 找到某一页的抢租记录
						data : {
							"currentPage" : currentPage,
							"userID":userID
						},
						success : function(result) {
							countPageCount();
							var table;
							for (var i = 0; i < result.length; i++) {
								var index = new Number(i + 1);
								var beginDate = new Date(result[i][3]);
								var endDate = new Date(result[i][4]);
								var timestamp = Date.parse(new Date());
								table = table
										+ "<tr id="+result[i][0]+"><td>"
										+ index
										+ "</td><td>"
										+ result[i][1]
										+ result[i][2]
										+ "</td><td>"
										+ beginDate.getFullYear()+"年"+(beginDate.getUTCMonth()+1)+"月"+
											beginDate.getUTCDate()+"日"+beginDate.getHours()+"时"
										+ "</td><td>"
										+ endDate.getFullYear()+"年"+(endDate.getUTCMonth()+1)+"月"+
											endDate.getUTCDate()+"日"+endDate.getHours()+"时"
										+ "</td><td>"
										+ result[i][5]
										+ "</td>";
										if(timestamp<endDate){
											table+="<td><button disabled='disabled' class='complaintBtn btn btn-danger '>投诉</button></td></tr>";
										}else{
											table+="<td><button class='complaintBtn btn btn-danger'>投诉</button></td></tr>"
										}	
							}
							$("#recordsTable tr:gt(0)").remove();
							var myTable = $("#recordsTable").append(table);
							for(var j = 0;j < result.length ;j++){
								var recordID = result[j][0];
								checkTheRecord(recordID);
							}
						}
					});
		};
		//设置按钮不能选
		function checkTheRecord(recordID){
			$.ajax({
				   type: "POST",
				   url: "checkRecordIDInTable.do",
				   data: {"recordID":recordID},
				   success: function(res){
					   if(res == 1){
						   $($("#"+recordID).children().last().children()).attr("disabled","disabled");
						   $("#"+recordID).children().last().children().html("您已投诉过");
					   }
				   }
				});
		}
		//投诉
		$("#recordsTable").on("click", ".complaintBtn", function() {
			var recordID = $(this).parent().parent().attr("id");
			window.location.href="complaintrecord.jsp?recordID=" + recordID;
		});
		//计算总共有多少页  
		function countPageCount() {
			var userID = $("#userID").val();
			$.ajax({
				type : "POST",
				url : "countRecordPageCount.do", //通过后台计算此抢租客下的所有租用记录的页数
				async : false,
				data : {
					"userID":userID
				},
				success : function(pageCount) {
					$("#pageCount").html(pageCount);
					var currentPage = $("#currentPage").html();
					if(pageCount == 0 ){
						$("#currentPage").html(0);
					}else if(currentPage != "" && currentPage != 0){
						$("#currentPage").html(currentPage);
					}else{
						$("#currentPage").html(1);
					}
				}
			});
		}
		//分页的四个按钮功能  方法
		$("#firstPage").on("click", function() {
			var pageCount = $("#pageCount").html();
			if(pageCount == 0){
				$("#currentPage").html(0);
			}else{
				$("#currentPage").html(1);
			}
			findAllRecord(1);
		})
		$("#pageUp").on("click", function() {
			var currentPage = $("#currentPage").html();
			var pageCount = $("#pageCount").html();
			if (currentPage > 1) {
				currentPage = currentPage - 1;
			} else if(pageCount == 0){
				currentPage = 0;
			}
			$("#currentPage").html(currentPage);
			findAllRecord(currentPage);
		})
		//下一页
		$("#pageDown").on("click", function() {
			var currentPage = $("#currentPage").html();
			var pageCount = $("#pageCount").html();
			if (currentPage >= pageCount) {
				$("#currentPage").html(pageCount);
			} else {
				var newPage = new Number(currentPage)+1;
				$("#currentPage").html(newPage);
			}
			currentPage = $("#currentPage").html();
			findAllRecord(currentPage);
		})
		$("#lastPage").on("click", function() {
			var pageCount = $("#pageCount").html();
			$("#currentPage").html(pageCount);
			findAllRecord(pageCount);
		})
		//跳转
		$("#forPage").on("click", function() {
			var countPage = $("#pageCount").html();
			var curPage = $("#currentPage").html();
				
				var pagger=$("#pagess").val();
				if(pagger>countPage){
					curPage=countPage;
					$("#pagess").val(countPage);
				}else if(pagger<1){
					curPage=1;
					$("#pagess").val("1");
				}else if(pagger==""){
					curPage=1;
					$("#pagess").val("1");
				}else{
					curPage=pagger;
				}
			findAllRecord(curPage);
		})
	</script>
</body>
</html>